<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>人员信息凭证</title>
    <style>
        body { 
            font-family: 'Arial', sans-serif; 
            max-width: 500px; 
            margin: 0 auto; 
            padding: 20px; 
            background-color: #f5f5f5; 
        }
        .card { 
            background-color: white; 
            padding: 25px; 
            border-radius: 12px; 
            box-shadow: 0 2px 10px rgba(0,0,0,0.1); 
        }
        .title { 
            color: #2c3e50; 
            text-align: center; 
            margin-bottom: 20px; 
            padding-bottom: 15px; 
            border-bottom: 1px solid #eee; 
        }
        .info-item { 
            margin-bottom: 15px; 
        }
        .label { 
            font-weight: bold; 
            color: #34495e; 
            display: inline-block; 
            width: 80px; 
        }
        .value { 
            color: #2c3e50; 
            word-break: break-all; 
        }
        .footer { 
            margin-top: 20px; 
            text-align: center; 
            color: #7f8c8d; 
            font-size: 0.9em; 
        }
        .github-link {
            display: block;
            text-align: center;
            margin-top: 15px;
            color: #165dff;
            text-decoration: none;
        }
    </style>
</head>
<body>
    <div class="card">
        <h2 class="title">人员信息凭证</h2>
        <div class="info-item">
            <span class="label">姓名:</span>
            <span class="value" id="name">加载中...</span>
        </div>
        <div class="info-item">
            <span class="label">年龄:</span>
            <span class="value" id="age">加载中...</span>
        </div>
        <div class="info-item">
            <span class="label">地址:</span>
            <span class="value" id="address">加载中...</span>
        </div>
        <div class="info-item">
            <span class="label">信息:</span>
            <span class="value" id="info">加载中...</span>
        </div>
        <div class="footer">电子凭证 · 永久有效</div>
    </div>

    <script>
        // 解析URL参数并显示人员信息
        function parseQueryParams() {
            const params = new URLSearchParams(window.location.search);
            document.getElementById('name').textContent = params.get('name') || '未提供';
            document.getElementById('age').textContent = params.get('age') || '未提供';
            document.getElementById('address').textContent = params.get('address') || '未提供';
            document.getElementById('info').textContent = params.get('info') || '未提供';
        }

        // 页面加载时解析参数
        window.onload = parseQueryParams;
    </script>
</body>
</html>